<template>
    <div>
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item label="内容">
                <el-input v-model="formInline.Content" placeholder="内容"></el-input>
            </el-form-item>

            <el-form-item>
                <el-button type="primary" @click="show()">查询</el-button>
            </el-form-item>
             <i class="el-icon-top" @click="show()"></i>
        <i class="el-icon-bottom" @click="ReverseOrder()"></i>
        </el-form>
        

        

        <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 80%">
            <el-table-column prop="OLid" label="操作日志ID" width="120"> </el-table-column>
            <el-table-column prop="Content" label="内容" width="250"> </el-table-column>
            <el-table-column prop="Classify" label="分类" width="120"> </el-table-column>
            <el-table-column prop="Module" label="模块" width="120"> </el-table-column>
            <el-table-column prop="Whether" label="是否异常" width="120">
                <template slot-scope="scope">
                    <span v-if="scope.row.Whether == true">正常</span>
                    <span v-if="scope.row.Whether == false">有误</span>
                </template>
            </el-table-column>
            <el-table-column prop="Use" label="应用名称" width="120"> </el-table-column>
            <el-table-column prop="OperatorName" label="操作人" width="120"> </el-table-column>
            <el-table-column prop="CreateTimes" label="创建时间" width="300"> </el-table-column>
        </el-table>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="Pageindex"
            :page-sizes="[50, 100, 200]"
            :page-size="Pagesize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="recordCount"
        >
        </el-pagination>
    </div>
</template>

<script>
import { LogShow } from '@/api/OperationLog.js';
import { ReverseOrderShow } from '@/api/OperationLog.js';
export default {
    data() {
        return {
            tableData: [],
            multipleSelection: [],
            formInline: {
                Content: ''
            },
            Pageindex: 1,
            Pagesize: 50,
            recordCount: 0
        };
    },
    created() {
        this.show();
      
    },
    methods: {
        ReverseOrder() {
            let data = {
                Pageindex: this.Pageindex,
                Pagesize: this.Pagesize,
                Content: this.formInline.Content
            };
            console.log(data);
            //根据登录用户显示倒序日志分页
            ReverseOrderShow(data).then((res) => {
                //console.log(res);
                this.tableData = res.plist;
                this.recordCount = res.recordCount;
                console.log(this.tableData);
            });
        },
        //获取日志倒序信息
        ReverseOrderLogShow() {
            ReverseOrderShow().then((res) => {
                this.tableData = res.plist;
                this.recordCount = res.recordCount;
                console.log(this.tableData);
                //console.log(this.roleList)
            });
        },

        //获取日志信息
        OperationLogShow() {

            LogShow().then(res => {

                this.tableData = res.plist
                this.recordCount = res.recordCount;
                console.log(this.tableData)
                //console.log(this.roleList)
            })
        },

        show() {

            let data = {
                Pageindex: this.Pageindex,
                Pagesize: this.Pagesize,
                Content: this.formInline.Content,
            }
            //根据登录用户显示日志分页
            LogShow(data).then((res) => {
                //console.log(res);
                this.tableData = res.plist;
                this.recordCount = res.recordCount;
                console.log(this.tableData);
            });
        },

        handleSizeChange(val) {
            this.Pagesize = val;
            this.show();
        },
        handleCurrentChange(val) {
            this.Pageindex = val;
            this.show();
        }
    }
};
</script>